<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script src="../js/jquery-3.1.1.js" type="text/javascript"></script>
	<script src="../bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
	<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">

	<script type="text/javascript">
		$(document)
		.ready(
			function() {
				$
				.ajax({
					url : 'http://localhost:8080/Hello/dormitory/get_daily_checkin_data.do',
					type : 'post',
					data : {
						"id" : 2,
						"type" : 3,
						"query_type" : 1
					},
					dataType : 'json',
					success : function(data) {
						console.log(data);
						showtable(data);
						showselect();
					},
					error : function(data) {
						console.log("失败");
					}
				})

			});

		function showtable(data) {
			var records = data.records;
			var result_3_count = 0;
			var result_2_count = 0;
			var result_1_count = 0;
			$.each(records, function(name, value) {

				switch (value.checkin_result) {
					case "3":
					result_3_count = result_3_count + 1;
					$('#result_3').after(
						"<tr name='data_1'>" + "<td >" + value.student_id + "</td>" + "<td >"
						+ value.student_name + "</td>" + "<td >"
						+ value.zoom_1 + "</td>" + "<td >"
						+ value.zoom_2 + "</td> " + "<td >"
						+ value.zoom_3 + "</td>" + "<td >"
						+ value.checkin_time + "</td>"

						+ "</tr> ");
					break;
					case "2":
					result_2_count = result_2_count + 1;
					$('#result_2').after(
						"<tr name='data_2'>" + "<td >" + value.student_id + "</td>" + "<td >"
						+ value.student_name + "</td>" + "<td >"
						+ value.zoom_1 + "</td>" + "<td >"
						+ value.zoom_2 + "</td> " + "<td >"
						+ value.zoom_3 + "</td>" + "<td >"
						+ value.checkin_time + "</td>"

						+ "</tr> ");
					break;

					case "1":
					result_1_count = result_1_count + 1;
					$('#result_1').after(
						"<tr name='data_3'>" + "<td >" + value.student_id + "</td>" + "<td >"
						+ value.student_name + "</td>" + "<td >"
						+ value.zoom_1 + "</td>" + "<td >"
						+ value.zoom_2 + "</td> " + "<td >"
						+ value.zoom_3 + "</td>" + "<td >"
						+ value.checkin_time + "</td>"

						+ "</tr>");
					break;

					default:
					break;
				}
			});
			$('#result_3_show').attr("rowspan", 1 + result_3_count);
			$('#result_2_show').attr("rowspan", 1 + result_2_count);
			$('#result_1_show').attr("rowspan", 1 + result_1_count);
			$('#result_summary').html(
				"失联：" + result_3_count + "请假：" + result_2_count + "未点到："
				+ result_1_count);
			$('#show_table_name').text(data.banji_name);
			$('#identity_type').val(data.identity_type);
			$('#query_type').val(data.query_type);
		}

		function showselect(data) {
			var identity_type = $('#identity_type').val();
			var query_type = $('#query_type').val();
			switch (identity_type) {
		case "1": //班主任
		$('#zoom_1').hide();
		$('#zoom_2').hide();
		break;
		case "2": //宿管员
		$('#banji_name').hide();
		break;
		case "3": // 超级用户
		$('#zoom_1').hide();
		$('#zoom_2').hide();
		break;
		case "4": //超级管理员

		break;

		default:
		break;
	}
	switch (query_type) {
		case "1": //单日数据
		$('#semester').hide();
		$('#time').show();

		break;
		case "2": //学期数据
		$('#time').hide();
		$('#semester').show();
		break;

		default:
		break;
	}
}

function screenData() {
	var semester = $('#semester ').val();
	var zoom_1 = $('#zoom_1 ').val();
	var zoom_2 = $('#zoom_2 ').val();
	var banji_name = $('#banji_name').val();
	var time = $('#time').val();
	var name = $('#name').val();
	var identity_type = $('#identity_type').val();
	var query_type = $('#query_type').val();

	$.ajax({
		url : 'http://localhost:8080/Hello/dormitory/screen_data.do',
		type : 'post',
		data : {
			"semester" : semester,
			"zoom_1" : zoom_1,
			"zoom_2" : zoom_2,
			"banji_name" : banji_name,
			"time" : time,
			"student_name" : name,
			"identity_type":identity_type,
			"query_type":query_type
		},
		dataType : 'json',
		success : function(data) {
			console.log(data);
			$('tr[name="data_1"]').remove();
			$('tr[name="data_2"]').remove();
			$('tr[name="data_3"]').remove();
			showtable(data);
		},
		error : function(data) {

		}
	})
	}
</script>
<title>当日考勤数据</title>
</head>
<body>
	<div class="container-fluid">
		<div class="row">
			<div class="col-md-6">
				<input type="hidden" id="identity_type">
			</div>
			<div class="col-md-6">
				<input type="hidden" id="query_type">
			</div>
		</div>
		<div class="row" style="margin-top: 10px">
			<div class="col-md-2"></div>
			<div class="col-md-8">
				<select id="semester">
					<option selected="selected" value="">学期</option>
					<option value="20141">2014学年第一学期</option>
					<option value="20142">2014学年第二学期</option>
					<option value="20151">2015学年第一学期</option>
					<option value="20152">2015学年第二学期</option>
					<option value="20161">2016学年第一学期</option>
					<option value="20162">2016学年第二学期</option>
				</select>
				<select id="zoom_1">
					<option selected="selected" value="">生活区</option>
					<option value="文一苑">文一苑</option>
				</select>
				<select id="zoom_2">
					<option selected="selected" value="">寝室楼</option>
					<option value="11楼">11楼</option>
					<option value="12楼">12楼</option>
				</select>
				<select id="banji_name">
					<option selected="selected" value="">班级</option>
					<option value="软件1班">软件1班</option>
					<option value="软件2班">软件2班</option>
				</select>
				<!-- <select id="time">
					<option selected="selected" value="">时间</option>
				</select> -->
				<input type="date" id="time">
				<input type="text" id="name" placeholder="学生姓名">
			</select>
		</div>
		<div class="col-md-2">
			<button class="btn btn-info" onclick="screenData()">检索</button>
		</div>
	</div>
	<div class="row" style="margin-top: 10px">
		<div class="col-md-1"></div>
		<div class="col-md-10">
			<div id="show_table_name"></div>
			<table class="table table-hover" id="show_table">
				<thead>
					<tr>
						<th>考核状态</th>
						<th>学号</th>
						<th>姓名</th>
						<th>生活区</th>
						<th>楼号</th>
						<th>寝室</th>
						<th>时间</th>
					</tr>
				</thead>
				





				<tbody id="tbody">
					<tr id="result_3">
						<td id="result_3_show">失联</td>
					</tr>


					<tr id="result_2">
						<td id="result_2_show">请假</td>

					</tr>
					<tr id="result_1">
						<td id="result_1_show">未点到</td>

					</tr>
				</tbody>

				<tfoot>
					<tr>
						<td>总计</td>
						<td colspan="6" id="result_summary"></td>
					</tr>
				</tfoot>

			</table>
		</div>
		<div class="col-md-1"></div>
	</div>
</div>
</body>
</html>
